<template>
	<div class="boxStyle">
		<el-row type="flex" class="row-bg">
			<el-col :span="1" class="text_Right" style="margin-top: 25px;">外部佣金:</el-col>
			<el-col :span="5" style="margin-right: 10px;">一级
				<el-input v-model="dist.inone" placeholder="" size="small"></el-input>
			</el-col>
			<el-col :span="5">二级
				<el-input v-model="dist.intwo" placeholder="" size="small"></el-input>
			</el-col>
		</el-row>
		<el-row type="flex" class="row-bg" style="margin-top: 20px;">
			<el-col :span="1" class="text_Right">审核:</el-col>
			<el-col :span="3" style="margin-right: 10px;">
			<el-radio-group v-model="dist.isAudit" style="margin-top: 3px;">
				<el-radio :label="1">需要</el-radio>
				<el-radio :label="2">不需要</el-radio>
			</el-radio-group>
			</el-col>
			<el-col :span="2" class="text_Right">提现额度:</el-col>
			<el-col :span="5" style="margin-right: 10px;margin-top: -5px;">
				<el-input v-model="dist.withdrawalMoney"size="small"></el-input>
			</el-col>
		</el-row>
		<el-row type="flex" class="row-bg" style="margin-top: 20px;">
			<el-col :span="1" class="text_Right" style="margin-top: 5px;">宣传图:</el-col>
			<el-col :span="12">
				<el-upload class="avatar-uploader" name="file" :action="url" :show-file-list="false" :onSuccess="actMainSuccess">
					<img v-if="imgurl+dist.mainPicture" :src="imgurl+dist.mainPicture" class="avatar">
					<i v-else class="el-icon-plus avatar-uploader-icon"></i>
				</el-upload>
				<span style="line-height: 2;display: block;">建议尺寸500*390px 显示在活动主页</span>
			</el-col>
		</el-row>
		<el-row type="flex" class="row-bg" style="margin-top: 20px;">
			<el-col :span="1" class="text_Right" style="margin-top: 5px;">简介:</el-col>
			<el-col :span="6">
				<el-input type="textarea" :rows="5" placeholder="请输入内容" v-model="dist.applyDesc"></el-input>
			</el-col>
		</el-row>
		<el-row type="flex" class="row-bg" style="margin-top: 20px;">
			<el-col :span="1" class="text_Right" style="margin-top: 5px;">规则:</el-col>
			<el-col :span="12">
				<ueditor v-model="dist.applyRules" id="editor1" ref="editor1"></ueditor>
			</el-col>
		</el-row>
		<el-row type="flex" class="row-bg" style="margin-top: 20px;">
			<el-col :span="2" class="text_Right" style="margin-top: 5px;margin-left:18px;"><el-button  v-if="addShow!==-1" type="primary" @click="save">保存</el-button></el-col>
		</el-row>
		<div style="height: 100px;"></div>
	</div>
</template>

<script>
	import { formatDate } from 'static/js/date.js'
	import ueditor from "components/ueditor.vue"
	import qs from "qs"
	import axios from "axios"       
	export default {
		data() {
			return {
				purl: this.$store.state.purl, //权限数组
				url:this.GLOBAL.url,
				imgurl:this.GLOBAL.imgurl,
				dist:{
				},
				addShow:0
			}
		},
		components:{
			ueditor
		},
		mounted() {
			this.load();
			this.addShow = this.purl[0].findIndex((val) => val === "/interface/dis/update") //判断是否拥有增加权限
		},
		methods: {
			load() {
				axios.get("/interface/dis/view").then((res) => {
					this.dist = res.data.data;
					console.log(this.dist)
				})
			},
			dateFormat: function(row, column) {
				var date
				if(row[column.property]) {
					date = new Date(parseInt(row[column.property])).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");
				}
				if(date == undefined) {
					return "";
				}
				return date;
			},
			actMainSuccess(res, file) {
				this.dist.mainPicture =res.data;
				this.$message.success("上传成功");
			},
			save() {
				var dist = this.dist
				var reg = /^(0.\d+|0|1)$/;
				if(dist.inone==""||dist.inone==null){
					this.$notify.error({
				          title: '错误',
				          message: '请输入外部佣金一级比例'
				    });
				    return
				}
				if(!reg.test(parseFloat(dist.inone))){
					this.$notify.error({
				          title: '错误',
				          message: '外部佣金一级请输入0-1直接的数字，可以是小数。例如0.25'
				    });
				    return
				}
				if(dist.intwo==""||dist.intwo==null){
					this.$notify.error({
				          title: '错误',
				          message: '请输入外部佣金二级比例'
				    });
				    return
				}
				if(!reg.test(parseFloat(dist.inone))){
					this.$notify.error({
				          title: '错误',
				          message: '外部佣金二级请输入0-1直接的数字，可以是小数。例如0.25'
				    });
				    return
				}
				if(dist.isAudit==null||dist.isAudit==""){
					this.$notify.error({
				          title: '错误',
				          message: '请选择是否参与审核'
				    });
				    return
				}
				if(dist.mainPicture==""||dist.mainPicture==null){
					this.$notify.error({
				          title: '错误',
				          message: '请上传宣传图'
				    });
				    return
				}
				delete dist.infour;
				delete dist.inthree;
				delete dist.infive;
				axios({
							method: 'post',
							url: '/interface/dis/update',
							data: dist,
							headers: {
								'Content-Type': 'application/json'
							}
						}).then((res) => {
					var msg = res.data;
					if(msg.code==1){
						this.$message({
				          message: '保存成功',
				          type: 'success'
				        });
				        this.load();
					}else{
						this.$notify.error({
				          title: '错误',
				          message: msg.msg
				    	});
					}
				})
			},
		}
	}
</script>

<style>
	.text_Right {
		text-align: right;
		margin-right: 15px;
	}
	.dist_div{
		width: 90%;
		margin-top: 30px;
		margin-left: 5%;
		font-size: 24px;
		border-bottom: 1px solid #e2e2e2;
	}
	.avatar-uploader .el-upload {
		border: 1px dashed #d9d9d9;
		border-radius: 6px;
		cursor: pointer;
		position: relative;
		overflow: hidden;
	}
	
	.avatar-uploader .el-upload:hover {
		border-color: #409EFF;
	}
	
	.avatar-uploader-icon {
		font-size: 28px;
		color: #8c939d;
		width: 150px;
		height: 150px;
		line-height: 150px;
		text-align: center;
	}
	
	.avatar {
		width: 150px;
		height: 150px;
		display: block;
	}
	
	.el-upload__input {
		display: none !important;
	}
	
	.el-upload-list__item-actions i {
		color: white !important;
	}
	.el-notification{z-index: 10056 !important;}
</style>